<template>
  <button @click="flag =!flag">点击显示/隐藏</button>
  <demo v-if="flag"></demo>

</template>

<script>
import { ref,onBeforeMount,onMounted,onBeforeUnmount,onUnmounted} from "vue"
import Demo from "./components/demo";

export default {
  name: 'App',
  components: {Demo},
  // beforeCreate(){
  //   console.log("befofeCreate")
  // },
  // created() {
  //   console.log("create")
  // },
  setup(){
    console.log("setup App")
    let flag = ref(true)
    onBeforeMount(()=>{
      console.log("onBeforeMount App")
    })
    onMounted(()=>{
      console.log("onMounted App")
    })
    onBeforeUnmount(()=>{
      console.log("onBeforeUnmount App")
    })
    onUnmounted(()=>{
      console.log("onUnmounted App")
    })

    return {
      flag,
    }
  }
}
</script>

<style>

</style>
